<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta itemprop="name" content="武汉加油！中国加油！"/>
    <meta itemprop="image" content="https://6368-chongsharp-cc-prod-1300526021.tcb.qcloud.la/wuhan/zhongnashan.jpg" />
    <meta name="description" itemprop="description" content="我为战“疫”中最可爱的人点赞，一起点屏幕为祖国加油吧！" />
    <title>全民战疫，武汉加油！中国加油！</title>


    <script src="static/js/jquery-1.11.1.min.js"></script>
    <script src="static/js/jquery.backstretch.min.js"></script>

    <!--<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js" type="text/javascript" charset="utf-8"></script>-->
    <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
    <link rel="stylesheet" href="static/css/heart.css">

    <style>
        #audio_btn {
            width: 30px;
            height: 30px;
            background-image: url(./static/img/icon_music.png);
            background-size: contain;

            position: fixed;
            top: 20px;
            right: 20px;
        }

        .rotate {
            -webkit-animation: rotating 1.2s linear infinite;
            -moz-animation: rotating 1.2s linear infinite;
            -o-animation: rotating 1.2s linear infinite;
            animation: rotating 1.2s linear infinite
        }

        @-webkit-keyframes rotating {
            from { -webkit-transform: rotate(0) }
            to { -webkit-transform: rotate(360deg) }
        }

        @keyframes rotating {
            from { transform: rotate(0) }
            to { transform: rotate(360deg) }
        }
        @-moz-keyframes rotating {
            from { -moz-transform: rotate(0) }
            to { -moz-transform: rotate(360deg) }
        }


        #album
        {
            margin-top: 40vh;
            width:100%;
            height:50vh
        }


    </style>
    <script type="text/javascript">
        var star_count = 0;

        var imgUrl = 'https://6368-chongsharp-cc-prod-1300526021.tcb.qcloud.la/wuhan/zhongnashan.jpg';
        var lineLink = 'https://pxcapps.chongsharp.com/api/wuhan/index.html';
        var shareTitle = '武汉加油！中国加油！';
        $.ajax({
            type : 'POST',
            url :  "https://pxcapps.chongsharp.com/api/wechat/getWxConfig",
            dataType : "json",
            data:{url:window.location.href.split('#')[0]},
            success : function(res){

                console.info("====getWxConfig===",res);
                var appId = res.item.appId;
                var timestamp = res.item.timestamp;
                var nonceStr = res.item.nonceStr;
                var signature = res.item.signature;

                wx.config({
                    debug: false,
                    appId: appId,
                    timestamp: timestamp,
                    nonceStr: nonceStr,
                    signature: signature,
                    jsApiList: [
                        'checkJsApi',
                        'onMenuShareTimeline',
                        'onMenuShareAppMessage'
                    ]
                });
                wx.ready(function() {

                    wx.onMenuShareTimeline({
                        title: shareTitle, // 分享标题
                        desc: '我为战“疫”中最可爱的人点赞，一起点屏幕为祖国加油吧！',
                        link: lineLink, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
                        imgUrl: imgUrl, // 分享图标
                        success: function () {
                            // 用户确认分享后执行的回调函数
                            // XJJ.msg("分享成功");
                        },
                        cancel: function () {
                            // 用户取消分享后执行的回调函数
                            //XJJ.msg("分享失改");
                        }
                    });
                    wx.onMenuShareAppMessage({
                        title: shareTitle, // 分享标题
                        desc: '我为战“疫”中最可爱的人点赞，一起点屏幕为祖国加油吧！',
                        link: lineLink, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
                        imgUrl: imgUrl, // 分享图标
                        type: '', // 分享类型,music、video或link，不填默认为link
                        dataUrl:'' , // 如果type是music或video，则要提供数据链接，默认为空
                        success: function () {
                            // 用户确认分享后执行的回调函数
                            //XJJ.msg("分享成功");
                        },
                        cancel: function () {
                            // 用户取消分享后执行的回调函数
                            //XJJ.msg("分享失改");
                        }
                    });
                });
            },
            error:function(response){

            }
        });
    </script>

</head>

<body>

<div>
    <div id="audio_btn" class="rotate">
        <audio loop src="./static/music.mp3" id="media" autoplay="autoplay"></audio>
    </div>

    <div class="heart_beat"></div>
    <div class="heart_count"></div>

    <p class="heart_count" id="star_count">0</p>


    <div id="album--"></div>


    <div class="btn_box">
        <div class="heart_btn" onclick="clickHeart();">
            <div class="heart_beat_icon"></div>
            <div>&nbsp;&nbsp;武汉加油！中国加油！</div>
            <div class="heart_beat_icon"></div>
        </div>
    </div>


    <div class="link">
        页面源码托管地址：
        <img class="git" src="./static/img/gitee.jpg"/>
        <a href="https://gitee.com/zhanghejie/wuhan">gitee</a>
        &nbsp;&nbsp;&nbsp;
        <img class="git" src="./static/img/github.jpg"/>
        <a href="https://github.com/zhanghejie/wuhan">github</a>
    </div>


</div>
</body>

</html>

<!--单击显示红心-->
<script src="static/js/heart.js"></script>
<script src="static/js/wuhan.js"></script>
<!--<script src="static/js/wuhan-wx.js"></script>-->
<script src="static/js/toast.js"></script>